<template>
	<view class="wrap">
		<navbar>
			<view class="Console_tab">
				<view class="item" @tap="Console_tab(0)" :class="{'active':Console_tab_index == 0}">{{$t('xianhuo')}}</view>
				<view class="xin"></view>
				<view class="item" @tap="Console_tab(1)" :class="{'active':Console_tab_index == 1}">{{$t('heyue')}}</view>
			</view>
		</navbar>
		<view class="tom-container">
			<Spot ref="Spot" v-if="Console_tab_index == 0"></Spot>
			<Contract ref="Contract" v-if="Console_tab_index == 1"></Contract>
		</view>
	</view>
</template>

<script>
import { mapState, mapGetters } from 'vuex';
import navbar from '@/components/navbar.vue';
import Contract from './components/SpotTab.vue';
import Spot from './components/Spot.vue';
export default {
	data() {
		return {
			Console_tab_index:1,
		};
	},
	onShow() {
		console.log('language',uni.getLocale())
		this.Console_Pro()
		console.log(this.$refs.Spot)
		if(this.$refs.Spot){
			this.$refs.Spot.Console_value = false;
			this.$refs.Spot.upCallback({num:1});
		}
		if(this.$refs.Contract){
			this.$refs.Contract.Console_value = false;
			this.$refs.Contract.liao_er({num:1});
		}
	},
	methods: {
		Console_tab(index){
			this.Console_tab_index = index;
		},
		Console_Pro(){
			this.$api.consoleApi
				.getConsoleInfo()
				.then(res => {
					console.log(res.data);
					this.$store.commit('saveConsole', res.data);
					if(res.data !=null){
						if(res.data.exchangeType == 'SPOT'){
							this.Console_tab_index = 0
						}
					}
				})
		}
		
	},
	components: {
		navbar,Contract,Spot
	}
};
</script>

<style lang="scss" scoped>
.tom-container{
	display: inline;
}
.Console_tab{
	display: flex;
	align-items: center;
	font-weight: 400;
	color: $tom-text-sub-color3;
	.item{
		font-size: 32rpx;
	}
	.xin{
		width: 4rpx;height: 40rpx;
		background-color: #fff;
		margin: 0rpx 20rpx;
	}
	.active{
		color: #fff;
		font-weight: bold;
		font-size: 36rpx;
	}
}

</style>
